<!DOCTYPE html>
<html lang="zh">
	<head>
		<meta charset="UTF-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<title>Document</title>
	</head>
	<body>
		<!-- 	
		v-html指令:
		1.作用:向指定节点中渲染包含htm1结构的内容。2.与插值语法的区别:
			(1).v-html会替换掉节点中所有的内容，{{xx}}则不会。
			(2).v-html可以识别html结构。
		3.严重注意: v-html有安全性问题!!!!
			(1).在网站上动态渲染任意HTML是非常危险的,容易导致XSS攻击。
			(2).一定要在可信的内容上使用v-html，永不要用在用户提交的内容上! -->
		<div id="app">
			<p v-text="msg">888</p>
			<div v-html="str"></div>
			<a href="javascript:console.log(document.cookie)">555</a>
		</div>
		<script src="../vue.js"></script>
		<script>
			var app = new Vue({
				el: '#app', //Id #id class .name  标签 div
				//输出的数据
				data: function() {
					return {
						msg: "<h1>66666</h1>",
						str:"<a href=javascript:console.log(document.cookie)></a>"
					}
				},
			});
			console.log(document.cookie)
		</script>
	</body>
</html>
